// 生成高德地图主题地址
function getTheme (theme) {
  // 自定义灰色主题
  if (theme === 'grey') {
    return 'amap://styles/e264956b840b5df7f9e0eef4ecbfa0a9'
  }
  return `amap://styles/${theme}`
}

// 高德地图官方提供的几种主题
const amapTheme = () => {
  const AMAP_THEME = [
    'whitesmoke',
    'darkblue',
    'dark',
    'light',
    'fresh',
    'grey',
    'graffiti',
    'macaron',
    'blue',
    'wine'
  ]
  const theme = {}

  AMAP_THEME.forEach(item => {
    theme[item] = getTheme(item)
  })
  return theme
}

// 按比例设置marker图标的大小
const MAX_SIZE = 44 * window.screenVwConstant.convertRate // 图标最大值
const MIN_SIZE = 18 * window.screenVwConstant.convertRate // 图标最小值
// const TOP_SIZE = [68, 56, 44] // top图标大小

/**
 * @description 按比例获取marker图标数据
 * @param {Number} radio 图标比例
 * @param {Boolean} isTop 是否是Top3的点
 * @returns
 */
function getRegionRadioMarker (radio, top) {
  let size = parseInt((MAX_SIZE - MIN_SIZE) * radio) + MIN_SIZE
  // if (typeof top === 'number') {
  //   size = TOP_SIZE[top]
  // }
  return {
    icon: `<div class="${typeof top === 'number' ? 'icon-marker-park__region' : 'icon-marker-park__region2'}" style="width: ${size}px;height: ${size}px;"></div>`,
    offset: new AMap.Pixel(-size / 2, -size / 2)
  }
}

// 按比例设置marker图标的大小
const MAX_SIZE_CIRCLE = 24 * window.screenVwConstant.convertRate // 图标最大值
const MIN_SIZE_CIRCLE = 8 * window.screenVwConstant.convertRate // 图标最小值

/**
 * @description 按比例获取marker图标数据
 * @param {Number} radio 图标比例
 * @param {Boolean} active 是否增加动态波纹效果
 * @returns
 */
function getCircleRadioMarker (radio, active) {
  const size = parseInt((MAX_SIZE_CIRCLE - MIN_SIZE_CIRCLE) * radio) + MIN_SIZE_CIRCLE
  return {
    icon: `<div class="icon-marker-circle ${active ? 'active' : ''}" style="width: ${size}px;height: ${size}px;box-shadow: 0 0 ${20 * (size / MAX_SIZE_CIRCLE)}px ${10 * (size / MAX_SIZE_CIRCLE)}px ${active ? 'rgba(197, 29, 79, .6);' : 'rgba(38, 117, 246, .8);'}"></div>`,
    offset: new AMap.Pixel(-size / 2, -size / 2)
  }
}

const markerIcon = {
  parkMarkerGreen: {
    icon: '<div class="icon-marker-park__green"></div>',
    offset: new AMap.Pixel(-13 * window.screenVwConstant.convertRate, -13 * window.screenVwConstant.convertRate)
  },
  parkSelectedMarker: {
    icon: '<div class="icon-marker-park__selected"></div>',
    offset: new AMap.Pixel(-16 * window.screenVwConstant.convertRate, -16 * window.screenVwConstant.convertRate)
  },
  parkMarkerGray: {
    icon: '<div class="icon-marker-park__gray"></div>',
    offset: new AMap.Pixel(-13 * window.screenVwConstant.convertRate, -13 * window.screenVwConstant.convertRate)
  },
  parkMarkerRed: {
    icon: '<div class="icon-marker-park__red"></div>',
    offset: new AMap.Pixel(-13 * window.screenVwConstant.convertRate, -13 * window.screenVwConstant.convertRate)
  },
  parkMarkerOrange: {
    icon: '<div class="icon-marker-park__orange"></div>',
    offset: new AMap.Pixel(-13 * window.screenVwConstant.convertRate, -13 * window.screenVwConstant.convertRate)
  },
  parkMarkerBlue: {
    icon: '<div class="icon-marker-park__blue"></div>',
    offset: new AMap.Pixel(-13 * window.screenVwConstant.convertRate, -13 * window.screenVwConstant.convertRate)
  }
}

export default {
  // 高德地图主题
  theme: amapTheme(),
  markerIcon,
  getRegionRadioMarker,
  getCircleRadioMarker
}
